<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
  <head>
    <meta charset="utf-8">
    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0" name="viewport">
    <meta content="admin, dashboard, bootstrap, template, flat, modern, theme, responsive, fluid, retina, backend, html5, css, css3"
          name="keywords">
    <meta content="" name="description">
    <meta content="ThemeBucket" name="author">
    <link href="#" rel="shortcut icon" type="image/png">
    <title>疫情填报系统</title>

    <div th:include="common :: commonheader"></div>

  </head>

  <body class="sticky-header">
    <section>
      <!-- 左边开始-->
      <div th:replace="~{common::leftmenu(index=1,active='main.html')}"></div>
      <!-- 左边结束-->

      <!--主要内容开始-->
      <div class="main-content">

        <!-- 头部分开始-->
        <div th:replace="common :: headermenu"></div>
        <!-- 头部分结束-->

        <!-- 页面标题开始-->
        <div class="page-heading">
          <h3>
            面板
          </h3>
          <ul class="breadcrumb">
            <li>
              <a href="#">仪表盘</a>
            </li>
            <li class="active"> 我的面板</li>
          </ul>
        </div>
        <!-- 页面标题结束-->

        <!--页面主体开始-->
        <div class="wrapper">
          <div class="row">
            <div class="col-md-6">
              <!--左上角统计开始-->
              <div class="row state-overview">
                <div class="col-md-12 col-xs-12 col-sm-6">
                  <div class="panel purple">
                    <div class="symbol">
                      <i class="fa fa-gavel"></i>
                    </div>
                    <div class="state-value">
                      <div class="value">340</div>
                      <div class="title">体温正常人数</div>
                    </div>
                  </div>
                </div>
              </div>
              <div class="row state-overview">
                <div class="col-md-6 col-xs-12 col-sm-6">
                  <div class="panel red">
                    <div class="symbol">
                      <i class="fa fa-tags"></i>
                    </div>
                    <div class="state-value">
                      <div class="value">18</div>
                      <div class="title">体温偏低统计</div>
                    </div>
                  </div>
                </div>
                <div class="col-md-6 col-xs-12 col-sm-6">
                  <div class="panel blue">
                    <div class="symbol">
                      <i class="fa fa-money"></i>
                    </div>
                    <div class="state-value">
                      <div class="value">390</div>
                      <div class="title">体温偏高统计</div>
                    </div>
                  </div>
                </div>
              </div>
              <!--statistics end-->
            </div>
            <div class="col-md-6">
              <!--右上角统计开始-->
              <div class="panel deep-purple-box">
                <div class="panel-body">
                  <div class="row">
                    <div class="col-md-7 col-sm-7 col-xs-7">
                      <div id="graph-donut" class="revenue-graph"></div>
                    </div>
                    <div class="col-md-5 col-sm-5 col-xs-5">
                      <ul class="bar-legend">
                        <li><span class="blue"></span>35.7以下</li>
                        <li><span class="green"></span>35.7-37.0</li>
                        <li><span class="purple"></span>37.0-37.3</li>
                        <li><span class="red"></span>37.3以上</li>
                      </ul>
                    </div>
                  </div>
                </div>
              </div>
              <!--右上角统计结束-->
            </div>
              <div class="col-sm-12">
                <section class="panel">
                  <header class="panel-heading">
                    Bar Chart
                    <span class="tools pull-right">
                            <a href="javascript:;" class="fa fa-chevron-down"></a>
                            <a href="javascript:;" class="fa fa-times"></a>
                         </span>
                  </header>
                  <div class="panel-body">
                    <div id="graph-bar"></div>
                  </div>
                </section>
              </div>
          </div>
        </div>
        <!--页面主体结束-->

        <!--页脚开始-->
        <div th:replace="common :: footer"></div>
        <!--页脚结束-->

      </div>
      <!--主要内容结束-->
    </section>

    <!--Morris Chart-->
    <script th:src="@{/js/morris-chart/morris.js}"></script>
    <script th:src="@{/js/morris-chart/raphael-min.js}"></script>
    <script th:src="@{/js/morris-chart/morris.init.js}"></script>


    <!-- 最后把js文件的页面加载速度 -->
    <div th:replace="common :: #commonscript"></div>

    <!--仪表板的图表-->
    <script th:src="@{/js/dashboard-chart-init.js}"></script>


  </body>
</html>
